<nav class="navbar navbar-default navbar-static-top" role="navigation">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false">
                <span class="sr-only">{{ 'site_name'|trans }}</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>

            <div class="navbar-toggle collapsed navbar-avatar-mobile" data-toggle="collapse" data-target="#navbar-collapse-user">
                {% set avatar = app.user ? app.user.avatar : asset('avatar/default.png') %}
                <img src="{{ asset(avatar) }}" alt="" width="25px" height="25px" class="img-circle">
            </div>

            {% if app.user %}
                <div class="navbar-toggle collapsed navbar-item-custom navbar-item-alert" data-toggle="collapse" data-target="#notification-navbar-collapse">
                    <a data-pjax href="{{ path('user_notice') }}"><i class="fa fa-bell fa-fw"></i> <span class="text badge nav-common-dot">0</span></a>
                </div>
                <div class="navbar-toggle collapsed navbar-item-custom navbar-item-message" data-toggle="collapse" data-target="#message-navbar-collapse">
                    <a data-pjax href="{{ path('user_message') }}"><i class="fa fa-envelope fa-fw"></i> <span class="text badge nav-common-dot">0</span></a>
                </div>
            {% endif %}

            <a data-pjax class="navbar-brand" href="{{ path('homepage') }}" style="padding-top: 8px">
                <img alt="Brand" src="{{ asset(options().siteLogo) }}" width="95px" height="30px">

                <span class="vmoex-version">{{ options().siteVersion }}</span>
            </a>
        </div>

        <div class="collapse navbar-collapse" id="navbar-collapse">
            <ul class="nav navbar-nav navbar-left">
                <li><a data-pjax href="{{ path('tabs_index') }}">{{ '板块'|trans }}</a></li>
                <li class="nav-chat-item">
                    <a data-pjax href="{{ path('bind_chat') }}">{{ 'blind.chat'|trans }}</a>
                    <div class="nav-chat-dot {%  if show_icon is not defined %}push-notifications-count {% endif %} hidden-xs hidden-sm"></div>
                </li>
                <li><a data-pjax href="{{ path('about') }}">{{ 'about'|trans }}</a></li>
            </ul>
            <form class="navbar-form navbar-left" id="site-search">
                <div class="input-group nav-search-bar">
                    <input type="text" id="search-content" class="form-control" placeholder="Search...">
                    <span class="input-group-addon"><i class="glyphicon glyphicon-search"></i></span>
                </div>
            </form>
            <ul class="nav navbar-nav navbar-right">
                {% if app.user %}
                    <li class="dropdown messages ">
                        <a data-pjax href="{{ path('user_notice') }}">
                            <i class="fa fa-bell fa-fw"></i>
                            <div class="nav-bell-dot hidden-xs hidden-sm"></div>
                        </a>
                    </li>
                    <li class="dropdown user-create">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                            <span class="glyphicon glyphicon-plus"></span>
                            <i class="fa fa-caret-down"></i>
                        </a>

                        <ul class="dropdown-menu">
                            <li>
                                <a href="{{ path('create_post') }}"><i class="fa fa-edit"></i> {{ 'nav_create_post'|trans }}</a>
                            </li>

                        </ul>
                    </li>
                    <li class="dropdown user-actions">
                        <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                            <img class="img-rounded" src="{{ asset(app.user.avatar) }}" alt="" style="float: left;width: 25px; height: 25px;margin-right: 10px;margin-top: -2px">
                            <span>{{ app.user.nickname }}</span>
                            <i class="fa fa-caret-down"></i>
                        </a>
                        <ul class="dropdown-menu dropdown-user">
                            {% if is_granted('ROLE_ADMIN') %}
                                <li>
                                    <a href="{{ path('admin_index') }}">
                                        <i class="fa fa-user fa-fw"></i> 后台管理
                                    </a>
                                </li>
                            {% endif %}
                            <li>
                                <a href="{{ path('user_home') }}" data-pjax>
                                    <i class="fa fa-home fa-fw"></i> {{ "nav_user_home"|trans }}
                                </a>
                            </li>
                            <li>
                                <a data-pjax href="{{ path('user_setting') }}" >
                                    <i class="fa fa-gear fa-fw"></i> {{ 'nav_user_setting'|trans }}
                                </a>
                            </li>
                            <li class="divider"></li>
                            <li>
                                <a href="{{ path('logout') }}">
                                    <i class="fa fa-sign-out fa-fw"></i> {{ 'logout'|trans }}
                                </a>
                            </li>
                        </ul>
                    </li>
                {% else %}
                    <li>
                        <a data-pjax href="{{ path('login') }}"><i class="fa fa-sign-in"></i> {{ 'login'|trans }}</a>
                    </li>
                    <li>
                        <a data-pjax href="{{ path('register') }}"><i class="fa fa-registered"></i> {{ 'register'|trans }}</a>
                    </li>

                {% endif %}
            </ul>
        </div>

        <div class="collapse navbar-collapse" id="navbar-collapse-user">
            <ul class="nav navbar-nav navbar-left">
                {% if app.user %}
                {% if is_granted('ROLE_ADMIN') %}
                    <li>
                        <a href="{{ path('admin_index') }}">
                            <i class="fa fa-user fa-fw"></i> 后台管理
                        </a>
                    </li>
                {% endif %}
                <li>
                    <a data-pjax href="{{ path('member_home', {username: app.user.username}) }}">
                        <i class="fa fa-home fa-fw"></i> {{ 'nav_user_home'|trans }}
                    </a>
                </li>
                <li>
                    <a data-pjax href="{{ path('user_setting') }}" >
                        <i class="fa fa-gear fa-fw"></i> {{ 'nav_user_setting'|trans }}
                    </a>
                </li>
                <li class="divider"></li>
                <li>
                    <a href="{{ path('logout') }}">
                        <i class="fa fa-sign-out fa-fw"></i> {{ 'logout'|trans }}
                    </a>
                </li>
                {% else %}
                <li>
                    <a data-pjax href="{{ path('login') }}"> {{ 'login'|trans }}</a>
                </li>
                <li>
                    <a data-pjax href="{{ path('register') }}"> {{ 'register'|trans }}</a>
                    {% endif %}
            </ul>
        </div>
    </div>
</nav>

{% if options().announce and hideAnnounceAlert() == false %}
    <div class="container">
        <div id="navSiteAnnounceAlert" class="alert alert-warning alert-dismissible" role="alert" style="margin-bottom: 10px">
            <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <i class="fa fa-bullhorn"></i> {{ options().announce.content|raw }}
        </div>
    </div>
{% endif %}

<div class="container">
    {% include 'flash_messages.html.twig' %}
</div>
